
import {CommonCurdDialgMixin, createCurdDialogMixin} from "../components/z-datatable/CurdDialgMixin";
// import {createDialogFormSlot} from "./form-slot-utils";

function createDialogFormSlot() {
  return `
<z-space v-if="scope.level === 1">
<el-button  type="primary"  @click="zform__callEvent('edit-form-submit', scope, $event)"">提交</el-button>
<el-button @click="zform__callEvent('edit-cancel', $event)"">取消</el-button>

</z-space>  
  `
}


let CurdHelper = {}
/**
 * @deprecated
 * @param properties
 * @param def
 * @param mixinOption
 * @returns {{defs: {[p: number]: *}, control: (*), id: *}|{mixins: *[], data(): {defs: {}, control: *, id: *}, methods: {onFormInitReady(*): void}}}
 */
CurdHelper.defineEditCom = function (name, {properties = {}, def = {}, mixinOption} = {}) {
  let template = `
    <div class="edit-com-rule" :class="id">
      <z-form-template
          v-if="formConfigLoaded"
          :slots="control.slots"
          :def="control.def"
          @fire="control.onFire"
          @ready="onFormInitReady"
      >
      </z-form-template>
  </div>
  `
  let mixin =  createCurdDialogMixin(mixinOption)

  let ret = {
    name,
    template,
    mixins: [
      mixin
    ],
    data() {
      let self = this;
      let id = ZY.rid();
      // console.log(properties)
      let control = self.defFormControl({
        slots: {
          object_beforeend: createDialogFormSlot()
        },
        def: {
          properties: properties,
          ...def
        }
      }, )
      return {
        id,
        defs: {
          [id]: control
        },
        control
      }
    },
    methods: {
      onFormInitReady(opt) {
        this.handleFormInitReady(opt)
      },
    }
  }

  return ret
}

/**
 *
 * @param name
 * @param content
 * @param com
 * @returns {{id: *}|{template: string, mixins: {methods: {findColumnDefByKey(*, *): (*|string)}, props: {def: null, isEdit: boolean, columns: null, row: null, columnKey: null, columDefMap: null}}[], data(): {id: *}, methods: {sendConfirm(*): void, sendCancel(): void}, name}}
 */
CurdHelper.defineDialogView = function (name, {content, com, data, methods, ...rest} = {}) {
  if (com) {
    window.CustomCusComponent.registerOnce(com)
  }
  let template = `
    <div class="zcrud-dialog-view" :id="id">
  ${content}
    </div>
  `

  let ret = {
    name,
    template,
    mixins: [
      CommonCurdDialgMixin
    ],
    data() {
      let self = this;
      let id = ZY.rid();
      // console.log(properties)

      let ret = {
        id
      }
      if (data) {
        ret = Object.assign(ret, data())
      }

      return ret
    },
    methods: {
      ...methods,
      sendConfirm(ret) {
        this.$emit('confirm', ret)
      },
      sendCancel() {
        this.$emit('cancel', {
        })
      }
    },
    ...rest
  }
  // console.log(rest)

  return ret
}

CurdHelper.defDialogView = function (opt = {}) {
  let name = 'CurdDialogView' + ZY.rid()
  return CurdHelper.defineDialogView(name, opt)
}

/**
 *
 * @param mixinOption
 */
CurdHelper.defineDetailView = function ({renderKeyValues, mixinOption} = {}) {
  let ret = {
    mixins: [
      CommonCurdDialgMixin
    ],
    methods: {
      $_renderProps(h) {
        let self = this
        // console.log(self.columns)
        return renderKeyValues(h, self.row, self.columns, self.index, { from: 'keyValue' })
      }
    },
    render(h) {
      // console.log(this.columns, this.row)

      let props = ''

      if (renderKeyValues) {
        props = this.$_renderProps(h)
      }


      return (<div class="detail_com">{props}</div>)
    }
  }
  return ret
}

/**
 *
 * @param name
 * @param mixinOption
 * @returns {{mixins: {methods: {}, props: {def: null, isEdit: boolean, columns: null, row: null, columnKey: null, columDefMap: null}}[]}}
 */
CurdHelper.defineDetailCom = function (name, {mixinOption, cls, ...rest} = {}) {
  function initTemplate() {
    return `
     <div class="crud-detail-com ${cls}" >
        <zw-layout class="crud-detail-com__row" row v-for="(value, key) in row">
          <template v-if="findColumnDefByKey(key, 'label')">
            <zw-layout class="crud-detail-com__key">{{findColumnDefByKey(key, 'label')}}</zw-layout>
            <zw-layout class="crud-detail-com__value" expand>{{value}}</zw-layout>
          </template>
        </zw-layout>
      </div>
    `
  }

  let ret = {
    name,
    mixins: [
      CommonCurdDialgMixin
    ],
    template: initTemplate(),
    ...rest
  }
  return ret
}

CurdHelper.CurdViewMixin = {
  props: {
    data: {
      type: Array,
      default() {
        return []
      }
    },
    items: {
      type: Array,
      default() {
        return []
      }
    },
    columns: {
      type: Array,
      default() {
        return []
      }
    },
    actions: null,
    rowKey: null,
    viewName: String,
    outSlots: null,
    ctxProps: null
  }
}

CurdHelper.defineView = function (def) {
  let ret = {
    mixins: [
      CurdHelper.CurdViewMixin
    ],
    ...def
  }
  return ret
}

export default CurdHelper
